<template>
  <dt-modal-edit ref="edit" title="无效原因" :width="600" :loading="loading" @ok="onOk">
    <div class="invalid_content">
      <!-- <Button :type="clickIdx==item?'primary':'default'" class="invalid_item"
        v-for="(item,index) in list" :key='item' @click="handelClick(item,index)">
        {{item}}
      </Button> -->
      <div class="other_warp">
        <Input v-model="info.content" type="textarea"
          placeholder="请描述原因…" :autosize="{minRows: 6,maxRows: 6}" show-word-limit
          :maxlength='200' />
      </div>

    </div>
  </dt-modal-edit>
</template>

<script>
  import clueCustomerMgr from '@/biz/customer/clueCustomer.js'

  export default {
    data() {
      return {
        loading: false,
        info: { content: '', key: '' },
        list: [
          // { key: '1', value: '空号/错号' },
          // { key: '2', value: '客户需求与本案不符' },
          // { key: '3', value: '客户明确表示不需要' },
          // { key: 'other', value: '其他' },
        ],
        clickIdx: '',
        userCustomerId: ''
      }
    },
    methods: {
      handelClick(item, idx) {
        console.log(item, idx)
        this.clickIdx = item
        this.info.key = item
      },
      onOk() {
        // if (!this.info.key) {
        //   this.$Message.warning('请选择无效原因')
        //   return
        // }
        if (!this.info.content) {
          this.$Message.warning('请输入原因')
          return
        }
        console.log(this.info)
        let remark = this.info.content
        this.loading = true
        let params = {
          customerType: 1,
          remark,
          userCustomerId: this.userCustomerId
        }
        clueCustomerMgr.setInvalidCustomer(params).then(res => {
          this.loading = false
          this.$emit('success')
          this.$refs.edit.hide()
        }).catch(() => {
          this.loading = false
        })
      },
      init() {
        clueCustomerMgr.getInvalidCauseList().then(res => {
          this.list = res
        })
      },
      show(data) {
        this.info.content = ''
        this.userCustomerId = data.userCustomerId
        this.$refs.edit.show()
        this.init()
      }
    }
  }
</script>

<style lang="scss" scoped>
  .invalid_content {
    .invalid_item {
      margin: 10px;
      // border: 1px solid #ccc;
      // border-radius: 3px;
    }

    .other_warp {
      padding: 10px;
    }
  }
</style>